<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style type="text/css">
	select{
		width:100px;
		height:100px;
	}



	</style>
</head>
<body>
	<form action="javascript:">
		<select name="" id="s1" size='2'>
			<option value="">选择水果</option>
			<option value="">apple</option>
			<option value="">orange</option>
			<option value="">pruple</option>
			<option value="">nangua</option>
			<option value="">xigua</option>
			<option value="">straberry</option>
		</select>
		<input type="button" value='>>' id='btn'>
		<select name="" id="s2" size='2'>
		<!-- 	<option value="">选择水果</option>
			<option value="">apple</option>
			<option value="">orange</option>
			<option value="">pruple</option>
			<option value="">nangua</option>
			<option value="">xigua</option>
			<option value="">straberry</option> -->
		</select>
	</form>
</body>
<script type="text/javascript">
	btn=document.getElementById('btn');
	s1=document.getElementById('s1');
	s2=document.getElementById('s2');
	opts=s1.options;
	btn.onclick=function(){
		idx=s1.selectedIndex;
		// s2.add(opts[idx]);
		s2.innerHTML+=opts[idx].outerHTML;

	}
</script>
</html>